<div class="row">
  <div class="col-sm-4 bs-docs-sidebar">
    <ul class="nav nav-list bs-docs-sidenav"
    ng-class="{affix:select.length < size}">
        <li ng-repeat="s in select">
          <a>
            <label class="close" aria-hidden="true"
            ng-click="unSelect(s)">
              &times;
            </label>
            {{ s.n }}
            <br/>
            <div class="btn-group">
              <label class="btn btn-sm btn-success incognito"
              ng-click="up($index)"
              ng-class="{disabled:$index == 0}">
                <i class="glyphicon glyphicon-chevron-up"></i>
              </label>
              <label class="btn btn-sm btn-success incognito"
              ng-click="down($index)"
              ng-class="{disabled:$index == select.length - 1}">
                <i class="glyphicon glyphicon-chevron-down"></i>
              </label>
              <label class="btn btn-sm btn-info back"
              ng-model="s.back" btn-checkbox>
                <span ng-switch on="back">
                  <span ng-switch-when="true" translate>
                    ₪ Current
                  </span>
                  <span ng-switch-default translate>
                    ₪ Back
                  </span>
              </span>
              </label>
              <label class="btn btn-sm btn-info incognito"
              ng-model="s.incognito" btn-checkbox translate>
                ☢ Private
              </label>
            </div><!-- btn-group -->
          </a>
        </li>
      </ul>
    </div><!-- span3 -->
    <div class="col-sm-8">          
      <div class="page-header">
        <h2>
          <i class="glyphicon glyphicon-list" ng-if="type == 'men'"></i>
          <i class="glyphicon glyphicon-search" ng-if="type == 'txt'"></i>
          <i class="glyphicon glyphicon-picture" ng-if="type == 'pic'"></i>
          <i class="glyphicon glyphicon-link" ng-if="type == 'lin'"></i>
          <span>{{ type + 'Menu' | translate }}</span>
          <small>{{ type + ' title' | translate }}</small>
        </h2>
      </div><!-- page-header -->
      <h3 translate>Language Selection</h3>
      <div class="btn-group">
        <label class="btn btn-default" ng-model="en" btn-checkbox>
          <i class="en"></i>
        </label>
        <label class="btn btn-default" ng-model="zh_CN" btn-checkbox>
          <i class="zh_CN"></i>
        </label>
        <label class="btn btn-default" ng-model="zh_TW" btn-checkbox>
          <i class="zh_TW"></i>
        </label>
        <label class="btn btn-default" ng-model="ru" btn-checkbox>
          <i class="ru"></i>
        </label>
      </div><!-- btn-group -->
      <h3 translate>Select</h3>
      <label class="btn btn-primary btn-lg" 
      ng-click="getMenus()">
        <i class="glyphicon glyphicon-download"></i>
        <span translate>Download new menus</span>
      </label>
      <div class="row" ng-repeat="g in groups">
        <h4 ng-if="g.items.length > 0">{{ g.label }}</h4>
        <table class="table table-bordered table-hover table-condensed"
        ng-if="g.items.length > 0">
          <tbody>
            <tr ng-if="showMenu(menu)" ng-repeat="menu in g.items">
              <td class="cm-flag">
                  <i ng-class="{true:menu.l, false:''}[isFlag]"></i>
              </td>
              <td>
                <label class="pull-right btn btn-xs btn-default"
                ng-class="{true:'hide', false:''}[isHideIcon(menu)]"
                ng-click="update(menu)">
                  <i class="glyphicon glyphicon-edit"></i>
                </label>
                <label>
                  <input type="checkbox"
                  ng-model="menu.select" ng-change="change(menu)"/>
                  {{ menu.n }}
                </label>
              </td>
            </tr>
          </tbody>
        </table>
      </div><!-- row -->
      <div class="page-header">
        <h2>
          <i class="glyphicon glyphicon-pencil"></i>
          <span translate>Custom</span>
          <small translate>Custom title</small>
        </h2>
      </div><!-- page-header -->
      <form name="f_custom_old">
        <div class="form-group" ng-repeat="c in custom">
          <div class="col-sm-3">
            <input maxlength="200" type="text" class="form-control" required
            ng-model="c.c" ng-Maxlength="200" ng-Minlength="1" menucode/>
          </div><!-- col-sm-3 -->
          <div class="input-group col-sm-6">
            <input type="url" class="col-sm-6 form-control" required
            ng-model="c.u"/>
            <div class="input-group-btn">
              <label class="btn btn-danger" title="{{ 'Delete' | translate }}"
              ng-click="delCustom(c)">
                <i class="glyphicon glyphicon-trash"></i>
              </label>
              <!--
              <label class="btn btn-warning" title="{{ 'Share' | translate }}"
              ng-click="putDialog(c)">
                <i class="glyphicon glyphicon-share"></i>
              </label>
              -->
            </div><!-- input-group-btn -->
          </div><!-- input-group -->
        </div><!-- ng-repeat -->
      </form>
      <form name="f_custom">
        <div class="form-group">
          <div class="col-sm-3">
            <input id="m_title" name="m_title" maxlength="200" type="text"
            class="form-control" required
            enter ng-model="newCustom.c" ng-Maxlength="200" ng-Minlength="1"
            menucode/>
          </div><!-- col-sm-3 -->
          <div class="input-group col-sm-6">
            <input id="i_url" type="url" required class="form-control" 
            ng-model="newCustom.u" enter="addCustom()"/>
            <div class="input-group-btn">
              <label class="btn btn-primary"
              title="{{ 'Added' | translate }}"
              ng-click="addCustom()">
                <i class="glyphicon glyphicon-plus"></i>
              </label>
            </div><!-- input-group-btn -->
          </div><!-- input-group -->
        </div><!-- form-group -->
        <div class="form-group">
          <span class="alert alert-error col-sm-3" 
          ng-if="f_custom.$error.menucode || f_custom_old.$error.menucode" translate>
            error name
          </span><!-- alert -->
          <span class="col-sm-9" >
            {{ 'help ' + type | translate }}
          </span>
        </div><!-- form-group -->
      </form>
      <div class="page-header col-sm-12">
        <h2>
          <i class="glyphicon glyphicon-th"></i>
          <span translate>Group</span>
          <small translate>Group title</small>
        </h2>
      </div><!-- page-header -->
      <form name="f_group_old">
        <div class="form-group" ng-repeat="c in group">
          <div class="col-sm-3">
            <input type="text" class="form-control" maxlength="200" required 
            ng-model="c.c" ng-Maxlength="200" ng-Minlength="1" menucode/>
          </div><!-- col-sm-3 -->
          <div class="input-group col-sm-6">
            <select class="form-control" multiple="multiple"
            ng-model="c.g" chosen ng-options="m.n group by m.t for m in menus">
            </select>
            <div class="input-group-btn">
              <label class="btn btn-danger"
              title="{{ 'Delete' | translate }}"
              ng-click="delGroup(c)">
                <i class="glyphicon glyphicon-trash"></i>
              </label>
            </div><!-- input-group-btn -->
          </div><!-- input-group -->
        </div><!-- form-group -->
      </form>
      <form name="f_group" class="line">
        <div class="form-group">
          <div class="col-sm-3">
            <input id="g_title" type="text" class="form-control" required
            maxlength="200" 
            enter ng-model="newGroup.c" ng-Maxlength="200" ng-Minlength="1"
            menucode>
          </div><!-- col-sm-3 -->
          <div class="input-group col-sm-6">
            <select id="g_select" class="form-control" multiple="multiple"
            ng-model="newGroup.g" ng-options="m.n group by m.t for m in menus" 
            chosen></select>
            <div class="input-group-btn">
              <label class="btn btn-primary"
              title="{{ 'Added' | translate }}"
              ng-click="addGroup(newGroup)">
                <i class="glyphicon glyphicon-plus"></i>
              </label>
            </div><!-- input-group-btn -->
          </div><!-- input-group -->
        </div><!-- form-group -->
        <div class="alert alert-error form-group"
        ng-if"f_group.$error.menucode || f_group_old.$error.menucode" translate>
          error name
        </div><!-- alert -->
      </form>
    </div><!-- span9 -->
  </div><!-- span9 -->
</div><!-- row -->
